<script>
export default {
  name: "Diagnose",
  methods: {
    setErrors(errors) {
      this.errors = errors;
    }
  },
  data() {
    return {
      errors: []
    }
  }
}
</script>

<template>
  <div v-if="errors.length === 0">
    <div class="d-flex justify-content-center align-items-center p-lg-5">
      <h3 class="text-secondary"><b>No data</b></h3>
    </div>
  </div>
  <div class="accordion" id="accordionPanelsStayOpenExample">
    <div v-for="(err, index) in errors" class="accordion-item">
      <h2 class="accordion-header">
        <button class="accordion-button" type="button" data-bs-toggle="collapse" aria-expanded="true"
                :data-bs-target="'#panel-' + index"
                :aria-controls="'panel-' + index">
          {{ err.type.summary.zh }}
        </button>
      </h2>
      <div :id="'panel-' + index" class="accordion-collapse collapse">
        <div class="accordion-body">
          <p v-for="rec in err.records">{{ rec.log }}</p>
        </div>
      </div>
    </div>
  </div>
</template>
